import Vue from 'vue' //用vue的方式加载
import VueRouter from 'vue-router'
import Index from '../views/Index.vue'
import Home from '../views/Home.vue'
import product from '../views/product'
import detail from "@/views/detail";
import cart from "@/views/cart";
import order from "@/views/order";
import orderList from "../views/orderList";
import orderConfirm from "../views/orderConfirm";
import orderPay from "@/views/orderPay";
import login from "@/views/login";
import aliPay from "@/views/aliPay";

Vue.use(VueRouter)

const routes = [
  {
    path: '/order',
    name: 'Home',
    component: Home,
    children:[
      {
        path: '/index',
        name: 'Index',
        component: Index
      },
      {
        path: '/product/:id',
        name: 'product',
        component: product
      },
      {
        path: '/detail/:id',
        name: 'detail',
        component: detail
      },
    ]
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
  },
  {
    path: '/cart',
    name: 'cart',
    component: cart
  },
  {
    path: '/order',
    name: 'order',
    component: order,
    children:[
      {
        path: 'list',
        name: 'orderList',
        component: orderList,
      },
      {
        path: 'confirm',
        name: 'orderConfirm',
        component: orderConfirm
      },
      {
        path: 'pay',
        name: 'orderPay',
        component: orderPay
      },
      {
        path: 'aliPay',
        name: 'aliPay',
        component: aliPay
      },
    ]
  },
  {
    path: '/login',
    name: 'login',
    component: login
  },


]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})

export default router
